Print Style Sheet and Export a Webpage to PDF in Selenium WebDriver

Zhimin Zhan

Follow

--

A repost of my daughter’s article with permission. I added a few notes. This is also included in my “How to in Selenium WebDriver” series.

Exporting a web page to PDF in automated tests as a test artifact can be useful for manual inspection later. For example, a suite of automated tests might generate multiple different customer invoices. After execution, manual testers can open and verify the printed invoices (PDF) look as expected.

Selenium v4 made exporting to PDF easy with driver.save_print_page.

Sample page: login in WhenWise as the test business account and view an invoice. The page looks like this:

Below is the current PDF-printed version of a WhenWise invoice (admin view, strictly no need to be printer-friendly, I will make it so):

It’s not very well formatted — the top nav and side nav are still there. It would be better if these weren’t displayed during PDF printing.

Luckily for us, we can hide them with CSS’ print style.

header, aside#left-sidebar-nav, #breadcrumbs, #invoice_payments_wrapper_div { display: none; # hide nav bars }

div#main { padding-left: 0px; }}

Rerun the test and get the new version of the PDF:

It is better!

Note: Currently, the Print-to-PDF in Selenium only works with headless mode.